<template>
  <PageLayout 
    title="上传虚构电影" 
    description="创造平行宇宙中的电影艺术，探索不同时空背景下的影像可能性"
  >
    <!-- 使用 MovieForm 组件 -->
    <MovieForm
      :submit-text="'上传虚构电影'"
      @cancel="$router.go(-1)"
      @submit="handleSubmit"
    />
  </PageLayout>
</template>

<script setup lang="ts">
import { onMounted } from 'vue'
import { useRouter } from 'vue-router'
import { useMovieStore } from '../store/useMovieStore'
import { useUiStore } from '../store/useUiStore'
import { useDraftStore } from '../store/useDraftStore'
import PageLayout from '../components/layout/PageLayout.vue'
import MovieForm from '../components/movie/MovieForm.vue'

const router = useRouter()
const movieStore = useMovieStore()
const uiStore = useUiStore()
const draftStore = useDraftStore()

// 初始化标签系统
onMounted(async () => {
  try {
    // 若不存在上传草稿，则确保表单状态干净；若存在草稿，交由表单组件恢复
    if (!draftStore.getUploadDraft()) {
      movieStore.resetForm()
    }
    
    await movieStore.initializeTags()
    console.log('标签系统初始化完成')
  } catch (error) {
    console.error('标签系统初始化失败:', error)
    uiStore.showError('标签系统初始化失败')
  }
})

// 处理提交
const handleSubmit = async () => {
  try {
    await movieStore.uploadMovie()
    uiStore.showSuccess('电影上传成功！')
    // 清除上传草稿
    draftStore.clearUploadDraft()
    router.push('/')
  } catch (error) {
    console.error('上传失败:', error)
    uiStore.showError(error instanceof Error ? error.message : '上传失败')
  }
}
</script> 